<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="../../../lib/jquery-1.8.3.js"></script>
    <style type="text/css">
        *{ margin:0; padding: 0;}
        body{ font-size: 12px;}
        .clear{ clear: both; height: 20px;}
        .test4{  height: 200px; color: black; width: auto; border: thick solid #f00;}
    </style>
</head>
<body>
    <div id="test1" style="width:10em;">
        test1
    </div>

    <p class="clear"></p>

    <div id="test2" style="float:left; border:1px solid #000; width:200px;">
        test2
    </div>
    <p class="clear"></p>

    <div id="test3" style="width:100px;height:100px;background:gold;">
        test3
    </div>

    <p class="clear"></p>

    <div id="test4" class="test4">
        test4
    </div>

    <script type="text/javascript">
        var test1 = document.getElementById('test1');
        var test2 = document.getElementById('test2');
        var test3 = document.getElementById('test3');
        var test4 = document.getElementById('test4');


    </script>
</body>
</html>